<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>会议列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/layuiadmin/style/admin.css" media="all">
</head>
<body>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">开始时间</label>
                    <div class="layui-input-block">
                        <input type="text" name="start" id="start" placeholder="请选择"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">结束时间</label>
                    <div class="layui-input-block">
                        <input type="text" name="end" id="end" placeholder="请选择"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <button class="layui-btn" lay-submit lay-filter="log-search" id="search">
                        <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                    </button>
                </div>
                <div class="layui-inline">
                    <button class="layui-btn" lay-submit lay-filter="log-search" id="reset">
                        重置
                    </button>
                </div>
            </div>

        </div>

        <div class="layui-card-body">
            <table id="demo" class="layui-hide" lay-filter="test"></table>
        </div>
    </div>
</div>
<script type="text/html" id="barDemo">
    <!--<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="more"><i class="layui-icon layui-icon-list"></i>审核</a>-->
    <!--<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>-->
</script>
<script type="text/html" id="toolbarDemo">
    <!--<div class="layui-btn-container">-->
        <!--<button class="layui-btn" lay-event="add">新增</button>-->
        <!--<button class="layui-btn layui-btn-danger " lay-event="delAll">批量删除</button>-->
    <!--</div>-->
</script>
<script type="text/html" id="imgTpl">
    <input type="hidden" id="img" value={{ d.img }} >
    <img style="display: inline-block; width: 100%; height: 100%;" src= {{ d.img }}>
</script>
<script type="text/html" id="Tpl">
    {{#  if(d.type == 0){ }}
    <a class="layui-btn layui-btn-normal layui-btn-xs">直播会议</a>
    {{#  } else if(d.type == 1){ }}
    <a class="layui-btn layui-btn-danger layui-btn-xs">视频会议</a>
    {{#  } }}
</script>
<script type="text/html" id="checkboxTpl">
    <input type="checkbox" id="hot" name="hot" lay-skin="switch" value="{{d.id}}" lay-filter="hot"  lay-text="热门|冷门" {{ d.ishot == 1 ? 'checked' : '' }}>
</script>
<script src="/layuiadmin/layui/layui.js"></script>
<script>
    layui.config({
        base: '/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use([ 'laydate','layer', 'table'], function () {
        var $ = layui.$,
            form = layui.form,
            laydate = layui.laydate,
            table = layui.table,
            layer = layui.layer;

        // 日期定义
        laydate.render({
            elem : '#start',
            type : 'datetime',
            format: 'yyyy-MM-dd HH:mm',
            done : function(value) {
                laydate.render({
                    elem : '#end',
                    type : 'datetime',
                    format: 'yyyy-MM-dd HH:mm',
                    min : value
                });
            }
        });

        //表格初始化
        table.render({
            elem : '#demo',
            id : 'idTest',
            url : '/getMeetings',
            page : true,
            toolbar: '#toolbarDemo',
            height : 'full-130',
            cellMinWidth : 80,
            cols : [ [ //表头
                {type: 'checkbox', fixed: 'left'},
                {
                    field : 'id',
                    title : 'ID',
                    width : 80,
                    sort : true
                }, {
                    field : 'title',
                    title : '标题',
                    width : 100,
                    sort : true
                }, {
                    field : 'type',
                    title : '会议形式',
                    width : 100,
                    sort : true,
                    templet: '#Tpl'
                } , {
                    field : 'content',
                    title : '内容',
                    width : 180,
                }, {
                    field : 'img',
                    title : '图片',
                    width : 70,
                    templet: "#imgTpl",
                    event: 'showImg'
                },  {
                    field : 'organizer',
                    title : '举办方',
                    width : 180
                }, {
                    field : 'start',
                    title : '开始时间',
                    width : 200,
                    sort : true,
                    templet: "<div>{{layui.util.toDateString(d.start, 'yyyy-MM-dd HH:mm')}}</div>"
                } ,{
                    field : 'end',
                    title : '结束时间',
                    width : 200,
                    sort : true,
                    templet: "<div>{{layui.util.toDateString(d.end, 'yyyy-MM-dd HH:mm')}}</div>"
                } ,{
                    field: 'status',
                    title: '是否热门',
                    width: 140,
                    templet: '#checkboxTpl',
                    unresize: true
                } ] ]
        });
        form.on('switch(hot)', function(obj){
            var id = this.value;
            if(obj.elem.checked){
                $.ajax({
                    type:"get",
                    contentType : 'application/json',
                    url:"/updateMeetingHot/"+id,
                    data:{
                    },
                    dataType : 'json',
                    success:function(data) {
                        layer.msg(data.msg,
                            {
                                icon:1,
                                time: 1000
                            });
                    }
                });
            }else{
                $.ajax({
                    type:"get",
                    contentType : 'application/json',
                    url:"/updateMeetingCold/"+id,
                    data:{
                    },
                    dataType : 'json',
                    success:function(data) {
                        layer.msg(data.msg,
                            {
                                icon:1,
                                time: 1000
                            });
                    }
                });
            }
        });
        //监听搜索
        $('#search').on('click', function() {
            var start = $('#start');
            var end = $('#end');
            if (start.val() != '' && end.val() != '') {
                table.reload('idTest', {
                    url : '/getMeetingsByTime',
                    page : {
                        curr : 1
                    },
                    where : {
                        start : start.val(),
                        end : end.val()
                    }
                });
            } else {
                layer.msg('请输入开始时间和结束时间', {
                    icon: 2,
                    time: 1500
                });
            }
        });
        //数据重置
        $('#reset').on('click', function() {
            $('#start').val('');
            $('#end').val('');
            table.reload('idTest', {
                url : '/getMeetings',
                page : {
                    curr : 1
                }
            });
        });

        //监听头工具栏事件
        table.on('toolbar(test)', function(obj) {
            var checkStatus = table.checkStatus(obj.config.id)
                ,checkData = checkStatus.data,
                formData = [];
            switch (obj.event) {
                case 'delAll':
                    if (checkData.length == 0){
                        layer.msg("不能为空");
                    } else {
                        layer.confirm('是否删除此记录?', {icon: 3, title:'提示'}, function(index){
                            for (var i = 0;i<checkData.length;i++){
                                formData.push(checkData[i].id);
                            }
                            $.ajax({
                                type:"delete",
                                contentType : 'application/json',
                                url:"/delActivity/"+formData,
                                data:{},
                                dataType : 'json',
                                success:function(data) {
                                    if (data.code == 200){
                                        layer.msg('删除成功',
                                            {
                                                icon:1,
                                                time: 1000
                                            },function(){
                                                table.reload('idTest', {
                                                    url : '/getMeetings',
                                                    page : {
                                                        curr : 1
                                                    }
                                                });
                                                layer.close(index); //关闭弹层
                                            });
                                    }else {
                                        layer.msg("后台出错");
                                    }
                                }
                            });
                        });
                    }
                    break;
            };
        });
        //监听工具条
        //监听事件
        table.on('tool(test)', function(obj) {
            var data = obj.data;
            switch (obj.event) {
                case 'del':
                    layer.confirm('是否删除此记录?', {icon: 3, title:'提示'}, function(index){
                        $.ajax({
                            type:"delete",
                            contentType : 'application/json',
                            url:"/delActivity/"+data.id,
                            data:{},
                            dataType : 'json',
                            success:function(data) {
                                if (data.code == 200){
                                    layer.msg('删除成功',
                                        {
                                            icon:1,
                                            time: 1000
                                        },function(){
                                            table.reload('idTest', {
                                                url : '/getMeetings',
                                                page : {
                                                    curr : 1
                                                }
                                            });
                                            layer.close(index); //关闭弹层
                                        });
                                }else {
                                    layer.msg("后台出错");
                                }
                            }
                        });
                    });
                    break;
                case 'showImg':
                    layer.photos(
                        {photos: {title: "查看图片", data: [{src: data.img}]}, shade: .01, closeBtn: 1, anim: 5}
                    );
                    break;
            };
        });
    });
</script>
</body>
</html>
